<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>店铺配置</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="/houtai/js/vue.js"></script>
    <script type="text/javascript" src="/houtai/js/jquery-2.1.4.js"></script>

    <link rel="stylesheet" href="/houtai/layuiadmin/layui/css/layui.css"  media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<!--------------------------------------头部工具条------------------------------------------>
<script type="text/html" id="headbar">
    <div class="layui-btn-container"  >
        <!--使用表达式让按钮动态显示，if条件为true则显示，false不显示-->
        {{#  if(insert){ }}
        <button type="button" class="layui-btn" lay-event="insert">
        <i class="layui-icon">&#xe654;</i> 新增
        </button>
        {{#  } }}

        <!--判断是否有删除权限-->
        {{#  if(del){ }}
        <button class="layui-btn layui-btn-danger" lay-event="getCheckData">
            <i class="layui-icon">&#xe640;</i> 批量删除
        </button>
        {{#  } }}
    </div>
</script>

<!-------------------------------------------- 每一行工具条 --------------------------------------->
<script type="text/html" id="barDemo">
    <!--判断是否有修改权限-->
    {{#  if(update){ }}
    <button type="button" class="layui-btn layui-btn-xs layui-btn-radius layui-btn-warm" lay-event="singleUpdate">
        <i class="layui-icon">&#xe642;</i> 修改
    </button>
    {{#  } }}

    <!--判断是否有删除权限-->
    {{#  if(del){ }}
    <button type="button" class="layui-btn layui-btn-xs layui-btn-radius layui-btn-danger" lay-event="singleDel">
        <i class="layui-icon">&#xe640;</i> 删除
    </button>
    {{#  } }}

    <button type="button" class="layui-btn layui-btn-xs layui-btn-radius" lay-event="downloadQrCode">
        <i class="layui-icon">&#xe67d;</i> 下载商家收款码
    </button>
</script>

<!---------------------------------------------条件搜索框------------------------------------------->
<div class="demoTable" style="margin-top: 10px">
    <form id="serachForm" class="layui-form">
        商家名称：
        <div class="layui-inline" style="margin-right: 20px">
            <input class="layui-input" name="businessName" id="serachBusinessName" autocomplete="off">
        </div>
        商家电话：
        <div class="layui-inline" style="width: 100px">
            <input class="layui-input" id="serachBusinessTel" name="businessTel" autocomplete="off">
        </div>
        <div class="layui-form-item" style="width: 200px;float: left;margin-right: 20px">
            <label class="layui-form-label">商家状态</label>
            <div class="layui-input-block">
                <select name="businessStatus" id="serachBusinessStatus">
                    <option value="0" selected>请选择</option>
                    <option value="1">正常</option>
                    <option value="2">下架</option>
                </select>
            </div>
        </div>

        <div class="layui-inline" style="margin-left: 10px">
            <!--这个地方的不能直接使用button标签，使用button标签会重复提交数据-->
            <input type="button" class="layui-btn" data-type="reload" value="搜索">
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>

    </form>
</div>

<!-----------------------------------------表格内容--------------------------------------------->
<div id="content">
    <table class="layui-table"
           lay-data="{url:'/houtai/page/deploy/shopdeploy/list',page:true,limit:10,limits:[10,20,10000],toolbar:'#headbar',
                     height:'full-100',loading:true,title:'用户信息表',
                     //把返回的数据result转为换layUI需要的格式，此处返回的是mybatisPlus的IPage对象，具体返回值自己设定
                     parseData: function(res){ //res 即为原始返回的数据
                        return {
                            'code': res.code, //解析接口状态
                            'msg': res.message, //解析提示文本
                            'count': res.obj.totalSize, //解析数据长度
                            'data': res.li //解析数据列表
                          };
                       },
                //给表格设置一个ID
               id:'test'}"
           lay-filter="filter">
        <thead>
        <tr>
            <!--开起全选框-->
            <th lay-data="{checkbox:true,fixed:'left'}"></th>
            <th lay-data="{field:'businessId',hide:true}">商家ID</th>
            <th lay-data="{field:'businessName'}">商家名称</th>
            <th lay-data="{field:'businessTel'}">商家电话</th>
            <th lay-data="{field:'businessAddr'}">商家地址</th>
            <th lay-data="{field:'longBusinessAddr',hide:true}">隐藏地址</th>
            <th lay-data="{field:'businessImg',templet:'#imgTpl'}">商家LOGO</th>
            <th lay-data="{field:'businessQrcode',hide:true}">QrCode</th>
            <th lay-data="{field:'businessStatus',
                templet:'#businessStatus'
            }">商家状态</th>
            <th lay-data="{field:'longitude'}">经度</th>
            <th lay-data="{field:'latitude'}">纬度</th>

            <!--最后一列操作列，有修改或删除的权限就显示这列，否者不显示，通过Vue实现-->
            <th v-if="isShow" lay-data="{field:'opeartion', width:300,fixed: 'right', toolbar: '#barDemo'}">操作</th>
        </tr>
        </thead>
    </table>
</div>

<!-----------这里是修改弹出层的表单信息,表单的id用于表单的选择，style是在本页隐藏，只有点击编辑才会弹出---------->
<div class="layui-row" id="popUpdateUser" style="display:none;">
    <form class="layui-form layui-form-pane" id="updateForm" lay-filter="updateFormFilter">
        <input name="businessId" hidden>
        <div class="layui-form-item" style="margin-top: 10px;margin-left: 30px;width: 470px">
            <label class="layui-form-label">商家名称</label>
            <div class="layui-input-block">
                <input name="businessName" id="businessName" autocomplete="off" placeholder="请输入商家名称" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 30px;width: 470px">
            <label class="layui-form-label">商家电话</label>
            <div class="layui-input-block">
                <input name="businessTel" id="businessTel" lay-verify="tel" placeholder="请输入商家电话" autocomplete="off" class="layui-input">
            </div>
        </div>

        <input name="businessImg" id="updateBusinessImg" hidden>
        <div class="layui-upload" style="margin-left: 30px;width: 470px">
            <button type="button" class="layui-btn" id="test2">更改商家logo</button><br>
            <span style="color: red">推荐尺寸：500(像素) x 500(像素)</span><br>
            <span style="color: red">注意事项：</span><br>
            <span style="color: red">图片选择完毕后必须点击下方"确认展示图"按钮，不然无法更新</span><br>
            <input type="button" class="layui-btn layui-btn-warm" id="uploadUpdate" value="确认商家logo">
            <div class="layui-upload-list" style="border: 1px dashed red;width: 200px;height: 200px">
                <img class="layui-upload-img" id="demo2" style="width: 200px;height: 200px">
            </div>
        </div>

        <div class="layui-form-item" style="margin-left: 30px;width: 470px">

            <div class="layui-form-item" id="up-area-picker">
                <div class="layui-form-label">所在地区</div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="province-selector"  id="upProvince"  lay-filter="province-1">
                        <option value="">请选择省</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="city-selector"  id="upCity" style="width:100px;" lay-filter="city-1">
                        <option value="">请选择市</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="county-selector" id="upCounty" style="width:100px;" lay-filter="county-1">
                        <option value="">请选择区</option>
                    </select>
                </div>
            </div>
            <label class="layui-form-label">详细地址</label>
            <div class="layui-input-block">
                <input type="text"  id="updateBusinessAddr" lay-verify="notNull" placeholder="请输入" autocomplete="off" class="layui-input">
                <input name="businessAddr" hidden id="upNorBusinessAddr">
                <input name="longBusinessAddr" hidden id="upLongBusinessAddr">
            </div>
        </div>
        <div class="layui-form-item" style="width: 470px;margin-left: 30px">
            <label class="layui-form-label">商家状态</label>
            <div class="layui-input-block">
                <input type="radio" name="businessStatus" value="1" title="正常">
                <input type="radio" name="businessStatus" value="2" title="下架">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 30px;width: 480px;float: left">
            <div class="layui-inline" style="width: 230px">
                <label class="layui-form-label">商家经度</label>
                <div class="layui-input-block">
                    <input type="text" name="longitude" id="longitude" lay-verify="longitude" placeholder="请输入经度" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline" style="width: 230px;margin-left: -5px">
                <label class="layui-form-label">商家纬度</label>
                <div class="layui-input-block">
                    <input type="text" name="latitude" id="latitude" lay-verify="latitude" placeholder="请输入纬度" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item" style="margin-top: 10px">
            <div class="layui-input-block">
                <input type="button" class="layui-btn" value="获取坐标" onclick="geoCode()">
                <input type="button" class="layui-btn" lay-submit lay-filter="updateSubmit" value="立即提交">
            </div>
        </div>
    </form>
    <!--地区显示区域-->
    <div id="container" style="width: 100%;height: 220px"></div>
</div>

<!-------------这里是新增弹出层表单信息,表单的id用于表单的选择，style是在本页隐藏，只有点击编辑才会弹出-->
<div class="layui-row" id="popInsertUser" style="display:none;">
    <form class="layui-form layui-form-pane" id="insertForm" lay-filter="insertFilter">
        <div class="layui-form-item" style="margin-top: 10px;margin-left: 30px;width: 470px">
            <label class="layui-form-label">商家名称</label>
            <div class="layui-input-block">
                <input name="businessName" id="insertBusinessName" lay-verify="notNull" autocomplete="off" placeholder="请输入商家名称" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 30px;width: 470px">
            <label class="layui-form-label">商家电话</label>
            <div class="layui-input-block">
                <input name="businessTel" id="insertBusinessTel" lay-verify="tel" placeholder="请输入商家电话" autocomplete="off" class="layui-input">
            </div>
        </div>

        <!--上传商家logo-->
        <input name="businessImg" id="businessImg" hidden>
        <div class="layui-upload" style="margin-left: 30px;width: 470px">
            <button type="button" class="layui-btn" id="test1">上传商家logo</button><br>
            <span style="color: red">推荐尺寸：500(像素) x 500(像素)</span><br>
            <span style="color: red">注意事项：</span><br>
            <span style="color: red">图片选择完毕后必须点击下方"确认展示图"按钮，不然无法上传成功</span><br>
            <input type="button" class="layui-btn layui-btn-warm" id="upload" value="确认商家logo">
            <div class="layui-upload-list" style="border: 1px dashed red;width: 200px;height: 200px">
                <img class="layui-upload-img" id="demo1"  style="width: 200px;height: 200px">
            </div>
        </div>


        <div class="layui-form-item" style="margin-left: 30px;width: 470px">
            <div class="layui-form-item" id="area-picker">
                <div class="layui-form-label">所在地区</div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="province-selector"  id="inProvince" data-value="重庆市" lay-filter="province-1">
                        <option value="">请选择省</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="city-selector" data-value="重庆市" id="inCity" style="width:100px;" lay-filter="city-1">
                    <option value="">请选择市</option>
                </select>
                </div>
                <div class="layui-input-inline" style="width: 111px;">
                    <select  class="county-selector" data-value="江北区"id="inCounty" style="width:100px;" lay-filter="county-1">
                        <option value="">请选择区</option>
                    </select>
                </div>
            </div>
            <label class="layui-form-label">详细地址</label>
            <div class="layui-input-block">
                <input type="text"  id="insertBusinessAddr" lay-verify="notNull" placeholder="请输入" autocomplete="off" class="layui-input">
                <input name="businessAddr" hidden id="inNorBusinessAddr">
                <input name="longBusinessAddr" hidden id="inLongBusinessAddr">
            </div>
        </div>
        <div class="layui-form-item" style="width: 470px;margin-left: 30px">
            <label class="layui-form-label">商家状态</label>
            <div class="layui-input-block">
                <input type="radio" name="businessStatus" value="1" checked title="正常">
                <input type="radio" name="businessStatus" value="2" title="下架">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 30px;width: 480px;float: left">
            <div class="layui-inline" style="width: 230px">
                <label class="layui-form-label">商家经度</label>
                <div class="layui-input-block">
                    <input type="text" name="longitude" id="insertLongitude" lay-verify="longitude" placeholder="请输入经度" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline" style="width: 230px;margin-left: -5px">
                <label class="layui-form-label">商家纬度</label>
                <div class="layui-input-block">
                    <input type="text" name="latitude" id="insertLatitude" lay-verify="latitude" placeholder="请输入纬度" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-form-item" style="margin-top: 10px">
            <div class="layui-input-block">
                <input type="button" class="layui-btn" value="获取坐标" onclick="geoInsertCode()">
                <input type="button" class="layui-btn" lay-submit lay-filter="insertSubmit" value="立即提交">
            </div>
        </div>
    </form>
    <!--地区显示区域-->
    <div id="insertContainer" style="width: 100%;height: 220px"></div>
</div>
<script type="text/html" id="businessStatus">
                  {{#  if(d.businessStatus === 1){ }}
                     <span class="layui-badge layui-bg-green">上架</span>
                  {{#  } else { }}
                   <span class="layui-badge">下架</span>
                  {{#  } }}
</script>
<script type="text/html" id="imgTpl">
    <ul>
        {{#  if(d.businessImg != null){ }}
            <img style="width: 50px;height: 30px" onclick="showBigImage(this)" src="{{d.businessImg}}" >
        {{#  } }}
    </ul>
</script>
<script src="/houtai/js/layui.js" charset="utf-8"></script>
<script src="/houtai/layuiadmin/layui/layui.js" charset="utf-8"></script>
<script src="/houtai/layuiadmin/layui/lay/modules/util.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=71ea5de71e27aa10b0f869b8d32d2abc&plugin=AMap.Geocoder"></script>

<!--------------------------------根据地址获取经纬度方法------------------------------>

<script>
    var map = new AMap.Map("insertContainer", {
        resizeEnable: true
    });
    var geocoder,marker;
    function geoInsertCode() {
        if(!geocoder){
            geocoder = new AMap.Geocoder({
                city: "023", //城市设为北京，默认：“全国”
            });
        }
        var province =$("#inProvince").val();
        var city =$("#inCity").val();
        var county = $("#inCounty").val();
        var addressx  = $("#insertBusinessAddr").val();
        var address = province+city+county+addressx;
        $("#inNorBusinessAddr").val(address);
        $("#inLongBusinessAddr").val(province+","+city+","+county+","+addressx);
        console.log($("#inNorBusinessAddr").val());
        console.log($("#inLongBusinessAddr").val());
        geocoder.getLocation(address, function(status, result) {
            if (status === 'complete'&&result.geocodes.length) {
                var lnglat = result.geocodes[0].location
                $("#insertLongitude").val(lnglat.lng);
                $("#insertLatitude").val(lnglat.lat);
                console.log(lnglat.lng);
                if(!marker){
                    marker = new AMap.Marker();
                    map.add(marker);
                }
                marker.setPosition(lnglat);
                map.setFitView(marker);
            }else{
                layer.msg("地址不合法");
            }
        })
    };


    var map1 = new AMap.Map("container", {
        resizeEnable: true
    });
    var geocoder,marker;
    function geoCode() {
        if(!geocoder){
            geocoder = new AMap.Geocoder({
                city: "023", //城市设为北京，默认：“全国”
            });
        }
        var province =$("#upProvince").val();
        var city =$("#upCity").val();
        var county = $("#upCounty").val();
        var addressx  = $("#updateBusinessAddr").val();
        var address = province+city+county+addressx;
        $("#upNorBusinessAddr").val(address);
        $("#upLongBusinessAddr").val(province+","+city+","+county+","+addressx);
        console.log($("#upNorBusinessAddr").val());
        console.log($("#upLongBusinessAddr").val());
        geocoder.getLocation(address, function(status, result) {
            if (status === 'complete'&&result.geocodes.length) {
                var lnglat = result.geocodes[0].location
                $("#longitude").val(lnglat.lng);
                $("#latitude").val(lnglat.lat);
                console.log(lnglat.lng);
                if(!marker){
                    marker = new AMap.Marker();
                    map1.add(marker);
                }
                marker.setPosition(lnglat);
                map1.setFitView(marker);
            }else{
                alert("地址不合法");
            }
        })
    }
</script>

<script>

    //定义四个全局变量用于是否显示增加、删除、修改按钮的权限验证
    var insert = false;//是否具备新增权限，默认不具备
    var del= false;
    var update= false;
    var isShow=false;
    var isChooseBusinessImg = false;
    var checkBusinessIsSure = false;
    var isChooseUpdateBusinessImg = false;
    var checkUpdateBusinessIsSure = false;
    //利用Vue判断是否具备每一行的删除或者修改权限
    var vue = new Vue({
        el:"#content",
        data:{
            buttons:[]
        },
        created:function(){

            $.ajax({
                url : "/houtai/page/deploy/shopdeploy/getlist",
                type : "get",
                dataType : "json",

                success : function(data) {
                    if(data.message=="success"){

                    }else if(data.message == "premissionException"){
                        location.href = "/houtai/page/exception/NoPremission.html";
                    }else{
                        location.href = "/houtai/page/exception/500.html";
                    }
                }
            });

        },
        computed:{
            isShow:function () {
                var _this = this;
                var delbtn=false;
                var updatebtn=false;
                //获取当前网页地址
                var url = location.pathname;
                $.ajax({
                    url: "/houtai/adminuser/buttons",
                    type: "get",
                    async: false,
                    data: {
                        url: url
                    },
                    dataType: "json",
                    success: function (data) {
                        console.log(data);
                        _this.buttons = data.li;
                        for(var i=0;i<_this.buttons.length;i++){
                            if(_this.buttons[i].menuUrl.indexOf("insert")!=-1){
                                insert = true;
                                break;
                            }
                        }
                        for(var i=0;i<_this.buttons.length;i++){
                            if(_this.buttons[i].menuUrl.indexOf("delete")!=-1){
                                del = true;
                                isShow = true;
                                delbtn = true;
                                break;
                            }
                        }
                        for(var i=0;i<_this.buttons.length;i++){
                            if(_this.buttons[i].menuUrl.indexOf("update")!=-1){
                                update = true;
                                isShow = true;
                                updatebtn =  true;
                                break;
                            }
                        }
                    }
                });

                if(delbtn||updatebtn){
                    return true;
                }else{
                    return false;
                }

            }
        },
        created:function () {

        }
    });
    //配置插件目录
    layui.config({
        base: '/houtai/js/'
        , version: '1.0'
    });
    //点击图片放大
    function showBigImage(e) {
        layer.open({
            type: 1,
            title: false,
            closeBtn: 0,
            shadeClose: true, //点击阴影关闭
            area: [$(e).width + 'px', $(e).height + 'px'], //宽高
            content: "<img src=" + $(e).attr('src') + " />"
        });
    };

    layui.use(['table','jquery','laypage','util','laydate','form','layer','layarea','upload'], function(){
        var table = layui.table;
        var $ = layui.jquery;
        var util = layui.util;
        var laydate = layui.laydate;
        var form = layui.form;
        var layer = layui.layer;
        var layarea = layui.layarea;
        var upload = layui.upload;

        layarea.render({
            elem: '#area-picker',
            change: function (res) {
                //选择结果
                console.log(res);
            }
        });
        layarea.render({
            elem: '#up-area-picker',
            change: function (res) {
                //选择结果
                console.log(res);
            }
        });

        //新增商家logo
        var uploadInst = upload.render({
            elem: '#test1'
            ,url: '/houtai/page/products/product/uploadProductImg' //改成您自己的上传接口
            ,auto: false
            ,bindAction: '#upload'
            ,choose: function(obj){
                isChooseBusinessImg = true;
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传成功
                if(res.code == 200){
                    var productImgHeadUrl = res.message.split("||")[0];
                    checkBusinessIsSure = true;
                    layer.msg('图片上传成功');
                    console.log(res.message);
                    $("#businessImg").val(productImgHeadUrl);
                }else{
                    layer.msg('图片校验失败');
                }
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">图片校验失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
        //判断是否未选择图片误点了确认按钮
        $("#upload").click(function () {
            if(!isChooseBusinessImg){
                layer.msg("还没有选择图片哦");
            }
        })

        //修改商家logo
        var uploadInst = upload.render({
            elem: '#test2'
            ,url: '/houtai/page/products/product/uploadProductImg' //改成您自己的上传接口
            ,auto: false
            ,bindAction: '#uploadUpdate'
            ,choose: function(obj){
                isChooseUpdateBusinessImg = true;
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo2').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传成功
                if(res.code == 200){
                    var productImgHeadUrl = res.message.split("||")[0];
                    checkUpdateBusinessIsSure = true;
                    layer.msg('图片上传成功');
                    console.log(res.message);
                    $("#updateBusinessImg").val(productImgHeadUrl);
                }else{
                    layer.msg('图片校验失败');
                }
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">图片校验失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
        //判断是否未选择图片误点了确认按钮
        $("#uploadUpdate").click(function () {
            if(!isChooseUpdateBusinessImg){
                layer.msg("还没有选择图片哦");
            }
        })

        //验证表单内容
        form.verify({
            notNull:function (value, item) {
                if(value == null || value.trim() == ''){
                    return "内容不能为空";
                }
            },
            longitude:[
                /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/,
                '经度整数部分为0-180,小数部分为0到6位!'
            ],
            latitude:[
                /^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/,
                '纬度整数部分为0-90,小数部分为0到6位!'
            ],
            tel:[
                /^1[3456789]\d{9}$/,
                '请输入正确的手机号'
            ]
        });
        //加载日期选择插件
        laydate.render({
            elem: '#startDate'
        });
        laydate.render({
            elem: '#endDate'
        });
        //刷新表单
        form.render();

        //监听顶部工具栏事件
        table.on('toolbar(filter)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data;
            switch(obj.event){
                case 'insert':
                    //开起弹出层
                    layer.open({
                        //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                        type: 1,
                        title: "添加商家信息",
                        area: ['550px', '600px'],//设置弹出层尺寸
                        content: $("#popInsertUser")//引用的弹出层的页面层的方式加载修改界面表单
                    });
                    break;
                //点击批量删除执行以下代码
                case 'getCheckData':
                    if(data.length < 1){
                        layer.msg("至少选择一行哦!!!");
                    }else{
                        layer.confirm('真的删除行么', function(index){
                            layer.close(index);
                            var data = checkStatus.data;
                            var businessIds = new Array();
                            for(var i = 0;i < data.length;i++){
                                businessIds.push(data[i].businessId);
                            }
                            console.log(businessIds);
                            var s = JSON.stringify(businessIds);
                            console.log(s);
                            $.ajax({
                                url:"/houtai/page/deploy/shopdeploy/delete",
                                data:{businessIds:s},
                                type:"post",
                                dataType:"json",
                                success:function (data) {
                                    if(data.message == "success"){
                                        layer.msg("删除成功",{icon: 6});
                                        //重载表格
                                        $(".layui-laypage-btn").click();
                                    }else if(data.message == "premissionException"){
                                        location.href = "/houtai/page/exception/NoPremission.html";
                                    }else if(data.message == "serverException"){
                                        location.href = "/houtai/page/exception/500.html";
                                    }else{
                                        layer.msg("删除失败", {icon: 5});
                                    }
                                }
                            })
                        });
                    }
                    break;
            };

        });

        //监听每一行工具条
        table.on('tool(filter)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var longAddr = data.longBusinessAddr;
            var addr = longAddr.split(",");
            $("#upProvince").val(addr[0]);
            console.log($("#upProvince").val());
            $("#upCity").val(addr[1]);
            $("#upCounty").val(addr[2]);
            $("#updateBusinessAddr").val(addr[3]);
            console.log($("#updateBusinessAddr").val());
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            console.log(data);
            if(layEvent === 'detail'){//查看
                //do somehing
            } else if(layEvent === 'singleDel'){ //删除
                layer.confirm('真的删除行么', function(index){
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        url:"/houtai/page/deploy/shopdeploy/delete",
                        data:{businessIds: data.businessId},
                        type:"post",
                        dataType:"json",
                        success:function (data) {
                            if(data.message == "success"){
                                layer.msg("删除成功",{icon: 6});
                                //重载表格
                                $(".layui-laypage-btn").click();
                            }else if(data.message == "premissionException"){
                                location.href = "/houtai/page/exception/NoPremission.html";
                            }else if(data.message == "serverException"){
                                location.href = "/houtai/page/exception/500.html";
                            }else{
                                layer.msg("删除失败", {icon: 5});
                            }
                        }
                    })
                });
            } else if(layEvent === 'singleUpdate'){ //编辑
                $("#demo2").attr("src",data.businessImg);
                form.val('updateFormFilter', {
                    "businessId": data.businessId,
                    "businessName":data.businessName,
                    "businessTel":data.businessTel,
                    "businessStatus":data.businessStatus,
                    "longitude":data.longitude,
                    "latitude":data.latitude,
                    "businessImg":data.businessImg,
                    "businessAddr":data.businessAddr,
                    "longBusinessAddr":data.longBusinessAddr
                });

                //开起弹出层
                layer.open({
                    //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                    type: 1,
                    title: "修改商家信息",
                    area: ['550px', '600px'],//设置弹出层尺寸
                    content: $("#popUpdateUser")//引用的弹出层的页面层的方式加载修改界面表单
                });
            }else if(layEvent === 'downloadQrCode'){//下载商家付款码
                console.log(data);
                console.log("businessQrCode="+data.businessQrcode);

                var businessQrcode = data.businessQrcode;
                console.log( businessQrcode.split("com/")[1]);
                if(businessQrcode != null){
                    location.href = businessQrcode + "?attname=" + businessQrcode.split("com/")[1];
                }
            }
        });

        //监听表单提交，上述的submit()中的值为事件过滤器的值
        form.on('submit(updateSubmit)', function(data){
            console.log("进入非空判断了。。。。。。。。。");
            //校验表单字段是否符合规则
            function checkNotNull(){
                var businessName = $("#businessName").val();
                var businessAddr = $("#upNorBusinessAddr").val();
                console.log("businessName="+businessName);
                console.log("upNorBusinessAddr="+businessAddr);
                var businessStatus = $("#businessStatus").val();
                if(businessName != null && businessName.trim() != '' && businessAddr != null && businessAddr.trim() != ""){
                    return true;
                }else {
                    return false;
                }
            }
            function checkTel(){
                var businessTel = $("#businessTel").val();
                if(!(/^1[3456789]\d{9}$/.test(businessTel))){
                    return false;
                }else {
                    return true;
                }
            }
            function checkLongitude(){
                var longitude = $("#longitude").val();
                if(!(/^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/.test(longitude))){
                    return false;
                }else {
                    return true;
                }
            }
            function checkLatitude(){
                var latitude = $("#latitude").val();
                if(!(/^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/.test(latitude))){
                    return false;
                }else {
                    return true;
                }
            }
            console.log("checkNotNull()="+checkNotNull());
            console.log("checkTel()="+checkTel());
            console.log("checkLongitude()="+checkLongitude());
            console.log("checkLatitude()="+checkLatitude());
            console.log("isChooseUpdateBusinessImg="+isChooseUpdateBusinessImg);
            console.log("checkUpdateBusinessIsSure="+checkUpdateBusinessIsSure);
            if(isChooseUpdateBusinessImg && !checkUpdateBusinessIsSure){
                layer.msg("请先确认商家logo后再提交");
            }else if(checkNotNull() && checkTel() && checkLongitude() && checkLatitude()){
                console.log("true");
                $.ajax({
                    url:"/houtai/page/deploy/shopdeploy/update",
                    data:$("#updateForm").serialize(),
                    type:"post",
                    dataType:"json",
                    success:function (data) {
                        if(data.message == "success"){
                            //关闭弹出层
                            layer.closeAll();
                            isChooseUpdateBusinessImg = false;
                            checkUpdateBusinessIsSure = false;
                            layer.msg("修改成功");
                            //重载表格
                            table.reload('test', {
                                url: '/houtai/page/deploy/shopdeploy/list',
                                page: {
                                    curr: $(".layui-laypage-em").next().html() //从当前页开始重载表格
                                }
                            });
                        }else if(data.message == "premissionException"){
                            location.href = "/houtai/page/exception/NoPremission.html";
                        }else if(data.message == "serverException"){
                            location.href = "/houtai/page/exception/500.html";
                        }else{
                            layer.msg("修改失败", {icon: 5});
                        }
                    }
                })
            }
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
        form.on('submit(insertSubmit)', function(data){
            //校验表单字段是否符合规则
            function checkNotNull(){
                var businessName = $("#insertBusinessName").val();
                var businessAddr = $("#insertBusinessAddr").val();
                if(businessName != null && businessName.trim() != '' && businessAddr != null && businessAddr.trim() != ""){
                    return true;
                }else {
                    return false;
                }
            }
            function checkTel(){
                var businessTel = $("#insertBusinessTel").val();
                if(!(/^1[3456789]\d{9}$/.test(businessTel))){
                    return false;
                }else {
                    return true;
                }
            }
            function checkLongitude(){
                var longitude = $("#insertLongitude").val();
                if(!(/^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6}|180)$/.test(longitude))){
                    return false;
                }else {
                    return true;
                }
            }
            function checkLatitude(){
                var latitude = $("#insertLatitude").val();
                if(!(/^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/.test(latitude))){
                    return false;
                }else {
                    return true;
                }
            }
            if(isChooseBusinessImg && !checkBusinessIsSure){
                layer.msg("请先确认商家logo后再提交");
            }else if(!isChooseBusinessImg){
                layer.msg("请先选择商家logo后再提交");
            }else if(checkNotNull() && checkTel() && checkLongitude() && checkLatitude()){
                $.ajax({
                    url:"/houtai/page/deploy/shopdeploy/insert",
                    data:$("#insertForm").serialize(),
                    type:"post",
                    dataType:"json",
                    success:function (data) {
                        if(data.message == "success"){
                            //关闭弹出层
                            layer.closeAll();
                            isChooseBusinessImg = false;
                            checkBusinessIsSure = false;
                            layer.msg("添加成功");
                            //重载表格
                            $(".layui-laypage-btn").click();
                            window.location.reload();
                        }else if(data.message == "premissionException"){
                            location.href = "/houtai/page/exception/NoPremission.html";
                        }else if(data.message == "serverException"){
                            location.href = "/houtai/page/exception/500.html";
                        }else{
                            layer.msg("添加失败", {icon: 5});
                        }
                    }
                })
            }
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        //设置搜索框查询条件
        var $ = layui.$, active = {
            reload: function(){
                var demoReload = $('#demoReload');
                //执行重载
                table.reload('test', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                        businessStatus:$("#serachBusinessStatus").val(),
                        businessName:$("#serachBusinessName").val(),
                        businessTel:$("#serachBusinessTel").val()
                    }
                }, 'data');
            }
        };

        //监听搜索框提交按钮
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        //监听修改框提交
        form.on('submit(formDemo)', function(data){
            layer.msg(JSON.stringify(data.field));
            return false;
        });
    });
</script>

</body>
</html>